package com.cn.por.auto.vue;


import cn.hsa.base.web.vo.WrapperResponse;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

@RestController
@RequestMapping("/api/comt")
public class ComtMgtController {

    @GetMapping("/getVue")
    public WrapperResponse<String> getVue(){
        return WrapperResponse.success("<template>\n" +
                "    <div class=\"html-container\">\n" +
                "      <div class=\"search-box\">\n" +
                "        <input type=\"text\" placeholder=\"输入关键字搜索\">\n" +
                "      </div>\n" +
                "      \n" +
                "    </div>\n" +
                "  </template>\n" +
                "  \n" +
                "  <script>\n" +
                "  \n" +
                "  \n" +
                "  export default {\n" +
                "    props: {},\n" +
                "    computed: {},\n" +
                "    components: {\n" +
                "   \n" +
                "    },\n" +
                "    data() {\n" +
                "      return {\n" +
                "       \n" +
                "      };\n" +
                "    },\n" +
                "    created() { \n" +
                "    \n" +
                "    },\n" +
                "    mounted() {\n" +
                "      this.$nextTick(() => { });\n" +
                "    },\n" +
                "    methods: {\n" +
                "      search(){\n" +
                "        \n" +
                "      },\n" +
                "    },\n" +
                "  };\n" +
                "  </script>\n" +
                "  \n" +
                "  <style scoped lang=\"less\">\n" +
                "  @w: 19.2vmax;\n" +
                "  @h: 10.8vmin;\n" +
                "  \n" +
                "  .html-container {\n" +
                "    height: 100vh;\n" +
                "    width: 100vw;\n" +
                "    overflow: hidden;\n" +
                "    .search-box {\n" +
                "      width: 1900/@w;\n" +
                "      text-align: center;\n" +
                "      margin: 20/@h 10/@w;\n" +
                "      padding-top: 10/@h;\n" +
                "      padding-bottom: 10/@h;\n" +
                "      padding-right: 0;\n" +
                "      padding-left: 0;\n" +
                "      input {\n" +
                "        margin: 0;\n" +
                "        width: 300/@w;\n" +
                "        height: 30/@h;\n" +
                "        font-size: 20/@w;\n" +
                "      }\n" +
                "  \n" +
                "      button {\n" +
                "        height: 50/@h;\n" +
                "        width: 100/@w;\n" +
                "        font-size: 20/@h;\n" +
                "        color: rgba(0,0,0,0.7);\n" +
                "        border: 0;\n" +
                "        border-radius: 3/@w;\n" +
                "        padding: 0;\n" +
                "        margin: 0;\n" +
                "      }\n" +
                "    }\n" +
                "  \n" +
                "    .preview-box {\n" +
                "      width: 1880/@w;\n" +
                "      display: grid;\n" +
                "      margin: 20/@h 10/@w;\n" +
                "      padding: 10/@h 10/@w;\n" +
                "      grid-template-columns: repeat(15,8%);\n" +
                "      .preview-item{\n" +
                "        img{\n" +
                "          width: 100/@w;\n" +
                "          height: 100/@w;\n" +
                "        }\n" +
                "      }\n" +
                "    }\n" +
                "  \n" +
                "    .content-box {\n" +
                "      display: flex;\n" +
                "      gap: 10/@w;\n" +
                "      width: 100%;\n" +
                "      .show-box {\n" +
                "        width: 1220/@w;\n" +
                "        height: 700/@h;\n" +
                "        display: flex;\n" +
                "        justify-content: center;\n" +
                "        align-items: center;\n" +
                "        box-shadow: inset 0 0 5/@w 2/@w #03559F;\n" +
                "        box-shadow: inset 0 0 5/@w 2/@w #03559F;\n" +
                "        border-radius: 5/@h;\n" +
                "        margin: 20/@h 10/@w;\n" +
                "        padding: 10/@h 0;\n" +
                "      }\n" +
                "      .select-box {\n" +
                "        width: 680/@w;\n" +
                "        height: 700/@h;\n" +
                "        box-shadow: inset 0 0 5/@w 2/@w #03559F;\n" +
                "        box-shadow: inset 0 0 5/@w 2/@w #03559F;\n" +
                "        border-radius: 5/@h;\n" +
                "        margin: 20/@h 10/@w;\n" +
                "        padding: 10/@h 10/@w;\n" +
                "        .copy-box {\n" +
                "          width: 100%;\n" +
                "          margin: 10/@h 0;\n" +
                "          button {\n" +
                "            box-sizing: content-box;\n" +
                "            height: 32/@w;\n" +
                "            font-size: 20/@w;\n" +
                "            color: rgba(0,0,0,0.7);\n" +
                "            background-color: rgb(90, 228, 255);\n" +
                "            border: 0;\n" +
                "            border-radius: 3/@w;\n" +
                "          }\n" +
                "        }\n" +
                "  \n" +
                "        .properties-select {\n" +
                "          width: 700/@w;\n" +
                "          height: 600/@h;\n" +
                "  \n" +
                "          .select-line {\n" +
                "            input {\n" +
                "              margin: 5/@w 0 5/@w 5/@w;\n" +
                "              width: 300/@w;\n" +
                "              height: 30/@w;\n" +
                "              font-size: 20/@w;\n" +
                "              background-color: transparent;\n" +
                "              border: solid 1px rgba(255, 255, 255, 0.6);\n" +
                "              border-radius: 5/@h;\n" +
                "            }\n" +
                "  \n" +
                "            button {\n" +
                "              box-sizing: content-box;\n" +
                "              height: 32/@w;\n" +
                "              font-size: 20/@w;\n" +
                "              color: rgba(0,0,0,0.7);\n" +
                "              background-color: rgb(90, 228, 255);\n" +
                "              border: 0;\n" +
                "              border-radius: 3/@w;\n" +
                "            }\n" +
                "          }\n" +
                "  \n" +
                "          .properties-tree {\n" +
                "            width: 100%;\n" +
                "            height: 300/@h;\n" +
                "          }\n" +
                "        }\n" +
                "      }\n" +
                "    }\n" +
                "  }\n" +
                "  </style>");
    };
}
